<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>修改曲线</title>
	<link rel="stylesheet" href="../../layui/css/layui.css">
</head>

<body>
	<form class="layui-form" action="" style="margin-left:70px;">
		<div class="layui-fluid">
			<div class="layui-card-body">
				<div class="layui-form" lay-filter="">

					<div class="layui-form-item">
						<label class="layui-form-label">曲线名称：</label>
						<div class="layui-input-block" style="width:160px">
							<select id="ident" name="ident" class="from-control" lay-filter="ident"></select>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">曲线别名：</label>
						<div class="layui-input-block" style="width:160px">
							<input type="text" id="name2" name="left" lay-verify="title" autocomplete="off"
								placeholder="请输入值" class="layui-input" style="width:160px">
						</div>
					</div>

					<div id="non" style="display: none;">
						<input type="text" id="hd1" hidden value="">
						<input type="text" id="hd2" hidden value="">
					</div>

					<div id="pubval">
						<div class="layui-form" lay-filter="">
							<div class="layui-form-item">
								<label class="layui-form-label">最大值：</label>
								<div class="layui-input-inline">
									<input type="text" id="Cmaxs" name="Cmax" value="" autocomplete="off"
										class="layui-input" style="width:160px">
								</div>
							</div>
						</div>
						<div class="layui-form" lay-filter="">
							<div class="layui-form-item">
								<label class="layui-form-label">最小值：</label>
								<div class="layui-input-inline">
									<input type="text" id="Cmins" name="Cmin" value="" autocomplete="off"
										class="layui-input" style="width:160px">
								</div>
							</div>
						</div>

						<div class="layui-form" lay-filter="">
							<div class="layui-form-item">
								<label class="layui-form-label">曲线单位：</label>
								<div class="layui-input-inline">
									<input type="text" id="Cmax" name="Cmax" value="" autocomplete="off"
										class="layui-input" disabled style="width:160px">
								</div>
							</div>
						</div>
						<div class="layui-form" lay-filter="">
							<div class="layui-form-item">
								<label class="layui-form-label">字体大小：</label>
								<div class="layui-input-inline">
									<input type="text" id="Cmin" name="Cmin" value="" autocomplete="off"
										class="layui-input" onKeyUp="this.value=this.value.replace(/[^\.\d]/g,'');"
										style="width:160px">
								</div>
							</div>
						</div>

					</div>

					<div class="layui-form-item">
						<label class="layui-form-label">文字颜色：</label>
						<div class="layui-input-inline" style="width: 120px;">
							<input type="text" value="" name="color" placeholder="请选择颜色" class="layui-input"
								id="test-form-input" disabled="disabled">
						</div>
						<div class="layui-inline" style="left: -11px;">
							<div id="test-form"></div>
						</div>
					</div>

				</div>
			</div>
		</div>

	</form>

</body>
<script type="text/javascript" src="../../layui/layui.js"></script>
<script type="text/javascript" src="../../jquery-3.0.0.min.js"></script>
<script type="text/javascript" src="../../layui/public.js"></script>
<script>
	var form;
	var colorpicker;
	var list;
	layui.use(['form', 'colorpicker', 'layer'], function () {
		form = layui.form;
		colorpicker = layui.colorpicker;
		var layer = layui.layer;

		//身份验证
		if (getoken != false) {
			
			//曲线名称的监听事件
			form.on('select(ident)', function (data) {
				var vs = $("#ident option:checked").val();
				for (var i = 0; i < list.length; i++) {
					if (vs == list[i].name) {
						$("#name2").val(list[i].name2);
						$("#Cmaxs").val(list[i].max);
						$("#Cmins").val(list[i].min);
						$("#Cmax").val(list[i].unit);
						$("#Cmin").val(list[i].size);
						$("#hd1").val(list[i].tablename)
						$("#hd2").val(list[i].parameter)
						$('#test-form-input').val(list[i].color);
						colorpicker.render({
							elem: "#test-form",
							color: list[i].color,
							done: function (color) {
								$('#test-form-input').val(color);
							}
						})
					}
				}

			})
		}

		//表单赋值
		colorpicker.render({
			elem: '#test-form'
			, color: '#1c97f5'
			, done: function (color) {
				$('#test-form-input').val(color);
			}
		});
	})

	function child(data) {
		list = data;
		for (let i = 0; i < data.length; i++) {
			console.log(data[1]);
			var option = "<option value=\"" + data[i].name + "\"";
			option += ">" + data[i].name + "</option>"; //动态添加数据
			$("select[name=ident]").append(option);
		}
		form.render();
		$("#Cmaxs").val(data[0].max);
		$("#name2").val(data[0].name2);
		$("#Cmins").val(data[0].min);
		$("#Cmax").val(data[0].unit);
		$("#Cmin").val(data[0].size);
		$("#hd1").val(data[0].tablename);
		$("#hd2").val(data[0].parameter);
		$('#test-form-input').val(data[0].color);
		colorpicker.render({
			elem: "#test-form",
			color: data[0].color,
			done: function (color) {
				$('#test-form-input').val(color);
			}
		})
	}
	var retdata = function () {
		var name = $("#ident option:checked").text(); //标识
		let name2 = $("#name2").val();
		let max = $("#Cmaxs").val();     //最大值
		let min = $("#Cmins").val();    //最小值
		let unit = $("#Cmax").val();    //单位
		let size = $("#Cmin").val();    //大小
		let tablename = $("#hd1").val(); //表名
		let parameter = $("#hd2").val();  //字段
		let color = $("#test-form-input").val();  //颜色
		var data = { name, name2, unit, size, tablename, parameter, color, max, min };
		return data;
	}
</script>

</html>